<template>
	<view class="cardS cu-list menu text-left solid-top" style="margin-top:0">
		<view class="cu-item" :class="arrow?'arrows':''" @click="couponBtn(arrow)">
			<view class="content">
				<!-- 标题 -->
				<text class="text-grey line-limit-one-length" :style="message.subText ? 'margin-top:20upx':''">
					{{message.title}}
					<text v-if="messageType==='coupon'" class='cu-tag radius line-red sm' style="font-size: 24rpx;">{{$t('JLink.coupon.BestDealSelected')}}</text>
				</text>
				<!-- 描述 -->
				<view v-if="message.subText" class="text-gray text-sm line-limit-one-length" style="height:68upx;line-height: 68upx;">{{subText}}</view>
			</view>
			<view class="action">
				<text :style="vaueStyle" :class="[arrow?'couponLeft':'',valueColor]">{{message.value}}</text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
		props:{
			message:{
				type:Object,
				default:()=>{
					return{
						title:'',
						value:'',
					}
				}
			},
			valueColor:{
				type:String,
				default:'text-red'
			},
			arrow:{
				type:Boolean,
				default:false
			},
			list:{
				type:Object,
				default:()=>{
					return {
						available:[],
						checkId:null
					}
				}
			},
			messageType:{//根据信息类型增加标签
				type:String,
				default:''
			},
			vaueStyle:{//值的样式
				type:String,
				default:'font-size:30upx;'
			}
			
		},
		methods:{
			couponBtn (val){
				if(val){
					this.$emit('click',this.list)
			    }
			}
		}
		
}
</script>

<style lang="less" scoped>
	@import '@/common/style/main.css';
.cardS .cu-list.menu>.cu-item{
	padding:0 48upx 0 30upx
}
.cardS>.cu-item.arrows:before{
	color:#8799a3!important;
}
.couponLeft{
	margin-right:30upx
}
</style>